<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:qy="http://thymeleafexamples">
<head>
    <meta charset="utf-8">
    <title>首页_杨青个人博客 - 一个站在web前端设计之路的女技术员个人博客网站</title>
    <meta name="keywords" content="个人博客,杨青个人博客,个人博客模板,杨青"/>
    <meta name="description"
          content="杨青个人博客，是一个站在web前端设计之路的女程序员个人网站，提供个人博客模板免费资源下载的个人原创网站。"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="assets/css/base.css" th:href="@{assets/css/base.css}" rel="stylesheet">
    <link href="assets/css/index.css" th:href="@{assets/css/index.css}" rel="stylesheet">
    <link href="assets/css/m.css" th:href="@{assets/css/m.css}" rel="stylesheet">
    <style>
        .classname {
            margin-right: 4px;
        }
    </style>
    <script>
        window.onload = function () {
            var oH2 = document.getElementsByTagName("h2")[0];
            var oUl = document.getElementsByTagName("ul")[0];
            oH2.onclick = function () {
                var style = oUl.style;
                style.display = style.display == "block" ? "none" : "block";
                oH2.className = style.display == "block" ? "open" : ""
            }
        }
    </script>
</head>
<body>
<header>
    <!--菜单栏-->
    <div class="tophead">
        <div class="logo"><a href="/">[[${blogConfig.firstTitle}]]</a></div>
        <div id="mnav">
            <h2><span class="navicon"></span></h2>
            <th:menu level="1"></th:menu>
        </div>
        <nav class="topnav" id="topnav">
            <th:menu level="1"></th:menu>
        </nav>
    </div>
</header>
<div class="picshow">
    <!--banner-->
    <ul>
        <li th:each="item : ${blogConfig.banner}"><a th:href="@{${item.link}}">
            <i>
                <img th:src="@{${item.imageUrl}}"></i>
            <div class="font">
                <h3>[[${item.desc}]]</h3>
            </div>
        </a></li>
    </ul>
</div>
<article>
    <div class="blogs">
        <!--文章列表-->
        <th:list type="article" mode="page" pageNumber="1" pageSize="10">
            <li th:each="item : ${localVar.records}"><span class="blogpic">
                <a th:href="${#qyUrl.getUrl('article',item.alias)}" th:if="not ${#strings.isEmpty(item.coverUrl)}">
                    <!--封面-->
                <img th:src="@{${item.coverUrl}}">
                </a>
            </span>
                <h3 class="blogtitle"><a th:href="${#qyUrl.getUrl('article',item.alias)}" th:text="${item.title}"></a>
                </h3>
                <div class="bloginfo">
                    <p th:utext="${item.abstractContent}">
                    </p>
                </div>
                <div class="autor"><span class="lm">
                    <a th:each="tag :${item.blogTagList}" th:href="${#qyUrl.getUrl('tag',tag.alias)}"
                       th:title="${tag.name}" target="_blank" class="classname" th:text="${tag.name}"></a>
                </span>
                    <span class="dtime">
                    [[${#temporals.format(item.publishTime, 'yyyy-MM-dd HH:mm:ss')}]]</span><span
                            class="viewnum">浏览（<a href="/">0</a>）</span><span
                            class="readmore"><a th:href="${#qyUrl.getUrl('article',item.alias)}">阅读原文</a></span>
                </div>
            </li>
        </th:list>
    </div>
    <div class="sidebar">
        <div class="about">
            <!--关于站长信息-->
            <div class="avatar"><img src="assets/images/avatar.jpg" alt=""></div>
            <p class="abname">随心</p>
            <p class="abposition">JAVA工程师</p>
            <div class="abtext">
                一个90后程序员，潜心研究代码。
            </div>
        </div>
        <!--搜索栏-->
        <div class="search">
            <form action="/e/search/index.php" method="post" name="searchform" id="searchform">
                <input name="keyboard" id="keyboard" class="input_text" value="请输入关键字"
                       style="color: rgb(153, 153, 153);"
                       onfocus="if(value=='请输入关键字'){this.style.color='#000';value=''}"
                       onblur="if(value==''){this.style.color='#999';value='请输入关键字'}" type="text">
                <input name="show" value="title" type="hidden">
                <input name="tempid" value="1" type="hidden">
                <input name="tbname" value="news" type="hidden">
                <input name="Submit" class="input_submit" value="搜索" type="submit">
            </form>
        </div>
        <div class="cloud">
            <h2 class="hometitle">标签云</h2>
            <ul>
                <th:list type="tag" mode="all">
                    <li th:each="item : ${localVar.records}"><a th:href="${#qyUrl.getUrl('tag',item.alias)}">[[${item.name}]]</a>
                    </li>
                </th:list>
            </ul>
        </div>
        <div class="paihang">
            <h2 class="hometitle">站长推荐</h2>
            <ul>
                <th:list type="article" mode="random" limit="10">
                    <li th:each="item : ${localVar.records}">
                        <b>
                            <a th:href="${#qyUrl.getUrl('article',item.alias)}"
                               target="_blank" th:text="${item.title}"></a>
                        </b>
                        <div>
                            <i th:if="not ${#strings.isEmpty(item.coverUrl)}"><img th:src="@{${item.coverUrl}}"></i>
                            <p>[[${item.abstractContent}]]</p>
                        </div>
                    </li>
                </th:list>
            </ul>
        </div>
        <div class="links">
            <h2 class="hometitle">友情链接</h2>
            <ul>
                <li><a href="http://www.jiangqiang.top" title="随心网">随心网</a></li>
                <li><a href="http://www.jiangqiang.top" title="随心网">随心网</a></li>
                <li><a href="http://www.jiangqiang.top" title="随心网">随心网</a></li>
            </ul>
        </div>
        <div class="weixin">
            <h2 class="hometitle">官方微信</h2>
            <ul>
                <img th:src="@{assets/images/wx.jpg}">
            </ul>
        </div>
    </div>
</article>
<div class="blank"></div>
<footer>
    <p>Design by <a href="/">随心网</a> <a href="/">渝ICP备11002373号-1</a></p>
</footer>
<script src="assets/js/nav.js"></script>
</body>
</html>
